//将会在getArticles.ts中被调用，getTitles是在Article.vue中定义的
import { nextTick } from "vue";
import { titleItem } from '@/types/titleItem'
export const useGetTitltes = (getTitles: Function) => {
    nextTick(() => {  //需要用到nextTick，因为需要等待文章内容渲染完成后再调用
        let h1Arr = document.getElementsByTagName('h1')  //获取一级标题
        let titles: titleItem[] = [];       //创建空数组存储标题
        console.log(h1Arr);
        for (let i = 0; i < h1Arr.length; i++) {    //将所有一级标题的内容装入h1Arr准备返回
            titles.push({
                text: (i + 1).toString() + ". " + h1Arr[i].innerHTML,   //拼接字符串
                top: (h1Arr[i].getBoundingClientRect().top + document.documentElement.scrollTop || document.body.scrollTop || window.screenTop),
                active: false
            }) //将标题内容、顶端距离、hover加入
        }
        console.log(titles);
        
        getTitles(titles)   //回传到article.vue
    })
}